<template>
	<view class="hot-video-item-container">
		<view class="video-box">
			<video id="myVideo" class="video" enable-danmu danmu-btn :src="data.play_url" controls />
		</view>
		<view @click="$emit('click', data)">
			<hot-video-info :data="data"></hot-video-info>
		</view>
	</view>
</template>

<script>
	export default {
		props: {
			data: {
				type: Object,
				required: true
			}
		},
		name: "hot-video-item",
		data() {
			return {};
		},
		methods: {
		}
	}
</script>

<style lang="scss" scoped>
	.hot-video-item-container {
		margin-bottom: $uni-spacing-col-lg;
		padding: 0 10px;
		position: relative;

		.video {
			width: 100%;
			height: 230px;
		}
	}
</style>
